<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="jQuery1.12.4.min.js"></script>
		<script src="vue_2.2.2.min.js"></script>
		<style>
			table,th,td,tr,tbody{
				margin: 0 auto;
				border: 1px solid black;"
			}
			
			#date_info{
				text-align: center;
				font-size: large;
			}
			body{
			}
		</style>
	</head>
	<body>
	<div id="date_info"> </div> 
		<div id="myList">
			
		<div style="text-align: center; color:red">需要注意<br><hr>
		（章）需要院团委书记盖章<br>
		（字）需要学院团委书记签字<br>
		【电】 需要电子邮件发送材料<br>
		【纸】 需要纸质版的材料交办公室</div>
		
		<marquee behavior="" direction=""><span style="color: blue;">所有活动的材料、活动照片需电子留存。网盘留存以防丢失！期末以及学年结束的时候，要写活动汇总，需要使用！</span></marquee>
		<table style="text-align: center; background-color: skyblue;">
			<thead>
				<th>№</th><th>名称</th><th>注意事项</th>
			</thead>
			<tbody>
				<tr v-for="(line, index) in my_data">
					<td> {{index+1}}</td>
					<td v-for="(data, index) in line"><div style="text-align: left;"><span  v-html="data"></span></div> </td>
				</tr>
				
			</tbody>
			
		</table>
		</div>
		<hr>
		<div style="text-align: center;"><span >end.</span></div>
		
	</body>
	<script>
		var tab_data = [
			
			[
				"申请表（章）【纸】【电】",
				"社联活动管理部邮箱【电】（周 2 的 19:00 前）<br>交至社联活动办公室【纸】"
			],
			[
				"策划案（章）（字）【纸】【电】",
				"社联活动管理部邮箱【电】（周 2 的 19:00 前）<br>交至社联活动办公室【纸】"
			],
			[
				"到梦空间【软件申请】",
				"（周 2 的 19:00 前）"
			],
			[
				"*【可选，需提前联系办公室】红头文件活动通知【电】",
				"办公室邮箱<br>【可选，需提前联系办公室】"
			],
			[
				"宣传稿【电】",
				"（活动开始前的一天）<br>宣传部邮箱【电】"
			],
			[
				"总结稿【电】",
				"（活动结束后第 2 天 18:00 前）<br>宣传部邮箱【电】"
			],
			[
				"证书申请表（章）【纸】",
				"【活动在到梦空间颁发奖项完毕，活动完结后】提交纸质证书申请表。<br>上交时间与证书相同"
			],
			[
				"证书模板（纸）（社联盖章）",
				
				"<ol>\
				<li>请大家在规定时间内上交或拿回证书。</li>\
				<li>上交证书为 冬季每周二 18.30—20.30，夏季19:00-21:00</li>\
				<li>拿回证书时间为每周五 18.30—20.30;夏季19.00-21.00 </li>\
				<li>若本周未能及时上交或拿回证书，可在下周同一时间继续进行，时间不可超过两周。 </li>\
				<li>上交的证书均为未盖章的证书，社联将统一为大家盖校团委的公章。</li>\
				<li>不能盖各院的公章。</li></ol>"
			]
			
		]
		
		var app = new Vue({
			el:"#myList",
			data:{
				"my_data":tab_data
			}
		})
		
		function getWeekDate() {
		   var now = new Date();
		   var day = now.getDay();
		   var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
		   var week = weeks[day];
		   var w = [week, (7+2-day)%7];
		   var dateStr = now.toLocaleString();
		   return "现在："+dateStr+"<br>"+"今天是【"+w[0]+"】, 距离最近的周二还有【 "+w[1]+" 】天";
		}
		$(()=>{
			
			window.setInterval(()=>{
				$("#date_info").html(getWeekDate());
			}, 1000);
			
		})
		
	</script>
	
</html>